<template>
	<view>
		<uni-popup ref="selcon" zindex type="bottom" @maskClick="maskClick"  :safeArea="false">
			<view class="comBotBx p_rlt"  @touchmove.stop.prevent="">
				<view class="text-xll text-bold padding-left padding-top">{{data.title||'VIP专区资格券明细'}}</view>
				<view class="flex align-center padding-top padding-bottom-sm text-sm text-c9 text-center padding-lr-sm">
					<view class="flex-sub">
						面额
					</view>
					<view class="flex-twice">
						有效截止时间
					</view>
					<view class="flex-twice text-left padding-left-xl">
						可用渠道
					</view>
					<view class="flex-sub">
						使用规则
					</view>
				</view>
				<scroll-view scroll-y="true" class="sleScr">
					<view class="padding-lr-sm">
						<view v-for="(item,index) in data.sList" :key="index" class="scrItem">
							<view class="flex align-center minhbx">
								<view class="flex-sub padding-left-sm">
									<text class="text-bold">{{item.money}}</text>元
								</view>
								<view class="flex-twice text-center">
									{{item.endTime}}
								</view>
								<view class="flex-twice text-c9 padding-left-xl">
									{{index%2==0?'门店消费':'颐而康精选商城'}}
								</view>
								<view class="flex-sub text-c6 padding-right text-end padding-tb-xs point" @click="item.show=!item.show">
									<text :class="item.show?'cuIcon-fold':'cuIcon-unfold'"></text>
								</view>
							</view>
							<view class="text-sm text-c9">
								<uni-transition :mode-class="'fade'" :show="item.show">
									<view class="padding-left-sm padding-right padding-bottom-sm">
										限会员日当天门店使用，使用范围：颐而康精选商城、小颐有约、颐而康美食平台。
									</view>
								</uni-transition>	
							</view>
						</view>
						
					</view>
				</scroll-view>
				<view v-if="orSource!='detail'" class="text-lg botbox bg-white flex align-center justify-end">
					已选<text class="text-nred text-bold">{{data.totalNum}}</text> 张  
					<text v-if="data.totalMoney>0" class="text-nred text-bold padding-left-sm">{{data.totalMoney}}</text>元
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script setup lang="ts">
	import { ref, defineEmits,computed } from 'vue';
	const emit = defineEmits(["maskClick"])
	const selcon = ref()
	const props = defineProps({
	  // type: {
	  //   type: String,
	  //   default: "default",
	  // },
		data: {
		  type: Object,
		  default: () => {
		    return [];
		  },
		}
	});
	// computed(()=>{
		
	// })
	
	// const discountData = ref([
	// 	{
	// 		id: '1',
	// 		ids: 1,
	// 		money: 15,
	// 		type: 1, //优惠券类型
	// 		title: '新客专享券',
	// 		endTime: '2024-02-03',
	// 		select: true,
	// 		show: false,
	// 		ttyy: 0,// 0现金卷  1Vip贵宾劵
	// 		statue: 1,
	// 	},
	// 	{
	// 		id: '2',
	// 		ids: 2,
	// 		money: 500,
	// 		type: 1, //优惠券类型
	// 		title: 'VIP特价专区资格券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		num:1,
	// 		maxNum:20,
	// 		ttyy: 1,
	// 		content: '总计',
	// 		ttyyText: '500元内享8.5折',
	// 		statue: 2,
	// 	},
	// 	{
	// 		id: '2',
	// 		ids: 3,
	// 		money: 50,
	// 		type: 1, //优惠券类型
	// 		title: 'VIP特价专区资格券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		ttyy: 1,
	// 		content: '总计',
	// 		num:1,
	// 		maxNum:20,
	// 		ttyyText: '50元内享8.5折',
	// 		statue: 2,
	// 	},
	// 	{
	// 		id: '1',
	// 		ids: 4,
	// 		money: 50,
	// 		type: 1, //优惠券类型
	// 		title: '减满券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		content: '满50可用',
	// 		ttyy: 0,
	// 		statue: 1,
	// 	},
	// 	{
	// 		id: '1',
	// 		ids: 5,
	// 		money: 10,
	// 		type: 1, //优惠券类型
	// 		title: '减满券',
	// 		endTime: '2024-02-03',
	// 		content: '满50可用',
	// 		select: false,
	// 		show: false,
	// 		ttyy: 0,
	// 		statue: 1,
	// 	},
	// 	{
	// 		id: '2',
	// 		ids: 6,
	// 		money: 500,
	// 		type: 1, //优惠券类型
	// 		title: 'VIP特价专区资格券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		ttyy: 1,
	// 		content: '总计',
	// 		num:1,
	// 		maxNum:1,
	// 		ttyyText: '500元内享8.5折',
	// 		statue: 2,
	// 	},
	// 	{
	// 		id: '2',
	// 		ids: 7,
	// 		money: 50,
	// 		type: 1, //优惠券类型
	// 		title: 'VIP特价专区资格券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		ttyy: 1,
	// 		content: '总计',
	// 		num:1,
	// 		maxNum:50,
	// 		ttyyText: '500元内享8.5折',
	// 		statue: 2,
	// 	},
	// 	{
	// 		id: '1',
	// 		ids: 8,
	// 		money: 15,
	// 		type: 1, //优惠券类型
	// 		title: '新客专享券',
	// 		endTime: '2024-02-03',
	// 		select: false,
	// 		show: false,
	// 		ttyy: 0,// 0现金卷  1Vip贵宾劵
	// 		statue: 1,
	// 	},
	// ])
	const orSource = ref('')
	// const modeRuleClass = ref('fade')
	const open = (source: any='') => {
		orSource.value = source
		selcon.value.open()
	}
	const close = () => {
		selcon.value.close()
	}
	
	const maskClick = (e : any) => {
		// console.log('car-maskClick',e);
		emit("maskClick")
	}
	defineExpose({ open, close })
</script>

<style lang="scss" scoped>
	.comBotBx{
		padding-bottom:130rpx;
	}
	.botbox{
		@include baseab(100%, 130rpx);
		left: 0;
		bottom: 0;
		z-index: 1;
		box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.05);
		padding-right: 60rpx;
	}
	.sleScr{
		min-height: 300rpx;
		max-height: 60vh;
	}
	.minhbx{
		height: 72rpx;
	}
	.scrItem{
		min-height: 72rpx;
		overflow: hidden;
		background: rgba(246, 247, 249, 0.7);
		&:nth-child(2n){
			background: #fff;
		}
	}
</style>